<template>
 <div class="box">
    <p class="a1"> 文章标题：<input type="text" v-model="title"></p>
    <p> 是否公开：<van-switch v-model="checked" /></p>
    <p> 内容：<input type="text" v-model="content"></p>
    <p>
     <van-button type="primary" @click="send">发布</van-button>
     <van-button type="danger">重置</van-button>
    </p>
     
   </div>
  
</template>
<script>
import { showSuccessToast, showFailToast } from 'vant';
import http from '@/ustils/http';
import { ref } from 'vue';
// import router from './router';
export default {
  data() {
    return{
      title:'',
      content: '',
      status:false,
     list:[]
  }
},
 setup() {
   const checked = ref(true);
   return { checked };
 },
 methods: {
   send() {
     console.log("发布");
     http({
       url: '/posts',
       method: 'post',
       data: {
         title: this.title,
         content: this.content,
         status:this.checked
       }
     }).then(r => {
      console.log(r.data);
       this.list = r.data
       console.log(this.list); 
       this.title = '',
         this.content = "",
         this.status = false
         showSuccessToast('发布成功');
     })  
   },
 }
}
</script>
<style lang="scss" scoped>
.box{
 width: 500px;
 height: 500px;
margin: 0 auto;
border: 1px solid #cecece;
.a1{
 padding-top: 150px;
}
p{
 padding-left: 100px;
}
} 
</style>